<!-- 模板的使用 -->

<!-- 引入 vue 框架 -->
<script src="vue.js"></script>

<!-- 界面显示 -->
<div id="app">
    <p>{{title}}</p>
    <mcomponent></mcomponent>
</div>
<!-- 模板定义 -->
<template id="temp">
    <p>{{title}}</p>
</template>
<!-- 脚本声明 -->
<script>

    // 模板的绑定, 模标签名称
    Vue.component("mcomponent", {
        data() {
            return {
                title: "组件标题名称"
            }
        },
        // 绑定模板
        template: "#temp"
    })

    // vue 对象创建
    var vue = new Vue({
        el: "#app",
        data: {
            title: "我是主页面标题"
        },
        methods: {

        },

    })
</script>
